import React, { useContext } from 'react';
import classes from './index.module.css';
import classnames from 'classnames';
import BlockButton from '../BlockButton';
import { AppContext } from '@/store/index.context';

export default function Confirm() {
  const { messageStore } = useContext(AppContext);
  const { _confirmText, _callConfirmCancelFn, _callConfirmOkFn } = messageStore;

  return (
    <div className={classes.Confirm}>
      <div
        className={classes.ConfirmShadow}
        onClick={_callConfirmCancelFn}></div>
      <div className={classes.ConfirmBody}>
        <div className={classes.MessageBox}>
          <span
            className={classnames(
              'iconfont',
              'icon-wenhaoxiao',
              classes.QuoteIcon,
            )}></span>
          <span className={classes.MessageContent}>{_confirmText}</span>
        </div>
        <div className={classes.FooterButtons}>
          <BlockButton text="取消" onClick={_callConfirmCancelFn} />
          <BlockButton type="primary" text="确定" onClick={_callConfirmOkFn} />
        </div>
      </div>
    </div>
  );
}
